<template>
  <el-select v-model="value" placeholder="请选择" @change="handleChange">
    <el-option v-for="{ id, name } in metadataList" :key="id" :label="name" :value="id" />
  </el-select>
</template>

<script>
import { findAllMetaList } from '@/views/device/thing-model/api'

export default {
  name: 'SelectMetadata',
  props: {
    metadataId: {
      type: String,
      default: '',
    },
  },
  data() {
    return {
      value: '',
      metadataList: [],
    }
  },
  watch: {
    metadataId(val) {
      if (val === '') {
        this.value = ''
      }
    },
  },
  created() {
    this.initData()
  },
  methods: {
    async initData() {
      await this.findAllMetaList()
      this.value = this.metadataId
    },
    async findAllMetaList() {
      this.metadataList = await findAllMetaList()
    },
    handleChange(value) {
      this.$emit('change', value)
      this.$emit('update:metadataId', value)
    },
  },
}
</script>

<style scoped lang="scss"></style>
